﻿<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="UcEditProduct.ascx.cs" Inherits="ShopFine.userControls.UcEditProduct" %>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>

<div class="form-horizonal">
    <h4>
        <span runat="server" visible='<%# (DataItem is Telerik.Web.UI.GridInsertionObject) %>'>Add new product</span>
        <span id="Span1" runat="server" visible='<%# !(DataItem is Telerik.Web.UI.GridInsertionObject) %>'>Edit product: <%# DataBinder.Eval( Container, "DataItem.Name") == null ? "": DataBinder.Eval( Container, "DataItem.Name") %></span>
    </h4>
    <asp:Label ID="ltrMessage" runat="server"></asp:Label>
    <div style="float: left; min-width: 400px; max-width: 500px; margin-right: 5px">
        <div class="control-group">
            <label class="control-label" for="inputConPass">Category: </label>
            <div class="controls">
                <asp:DropDownList ID="ddlSubCategory" runat="server"></asp:DropDownList>
            </div>
        </div>
        <div class="control-group">
            <label class="control-label" for="inputConPass">Product Code: <span class="text-error">*</span></label>
            <div class="controls">
                <asp:TextBox Enabled='<%# (DataItem is Telerik.Web.UI.GridInsertionObject) %>' runat="server" id="inputProductCode" Text='<%# ProcessMyDataItem(DataBinder.Eval( Container, "DataItem.ProductCode")) %>' placeholder="SPxxxx"></asp:TextBox>
                <asp:RequiredFieldValidator ID="RequiredFieldValidator1" Display="Dynamic" runat="server" ForeColor="Red" ControlToValidate="inputProductCode" ErrorMessage="Product code is required."></asp:RequiredFieldValidator>
            </div>
        </div>
        <div class="control-group">
            <label class="control-label" for="inputConPass">Title: <span class="text-error">*</span></label>
            <div class="controls">
                <asp:TextBox runat="server" id="inputTitle" Text='<%# ProcessMyDataItem(DataBinder.Eval( Container, "DataItem.Name")) %>' placeholder="Title of Product"></asp:TextBox>
                <asp:RequiredFieldValidator ID="RequiredFieldValidator2" Display="Dynamic" runat="server" ForeColor="Red" ControlToValidate="inputTitle" ErrorMessage="Title is required."></asp:RequiredFieldValidator>
            </div>
        </div>
        <div class="control-group">
            <label class="control-label" for="inputConPass">Price: <span class="text-error">*</span></label>
            <div class="controls">
                <asp:TextBox runat="server" id="inputPrice" placeholder="Please enter number" Text='<%# ProcessMyDataItem(DataBinder.Eval( Container, "DataItem.Price")) %>'></asp:TextBox>
                <asp:RequiredFieldValidator ID="RequiredFieldValidator3" Display="Dynamic" runat="server" ForeColor="Red" ControlToValidate="inputPrice" ErrorMessage="Price is required."></asp:RequiredFieldValidator>
            </div>
        </div>
        <div class="control-group">
            <label class="control-label" for="inputConPass">Supplier: </label>
            <div class="controls">
                <asp:DropDownList ID="ddlSupplier" runat="server"></asp:DropDownList>
            </div>
        </div>
        <div class="control-group">
            <label class="control-label" for="inputConPass">Description: </label>
            <div class="controls">
                <asp:TextBox runat="server" ID="inputDescription" Text='<%# ProcessMyDataItem(DataBinder.Eval( Container, "DataItem.Description")) %>' TextMode="MultiLine" placeholder="Descriprion for Product"></asp:TextBox>
            </div>
        </div>
    </div>
    <div style="float: left; width: 50%">
        <div class="control-group">
            <label class="control-label" for="inputConPass">Display Image: <span class="text-error">*</span></label>
            <div class="controls">
                <asp:FileUpload ID="FileUploadKey" runat="server" />
                <asp:Label ID="lblFileUploadMessage" runat="server"></asp:Label>
            </div>
        </div>
        <div class="control-group">
            <label class="control-label" for="inputConPass">Image 1: </label>
            <div class="controls">
                <asp:FileUpload ID="FileUpload1" runat="server" />
            </div>
        </div>
        <div class="control-group">
            <label class="control-label" for="inputConPass">Image 2: </label>
            <div class="controls">
                <asp:FileUpload ID="FileUpload2" runat="server" />
            </div>
        </div>
        <div class="control-group">
            <label class="control-label" for="inputConPass">Image 3: </label>
            <div class="controls">
                <asp:FileUpload ID="FileUpload3" runat="server" />
            </div>
        </div>
        <div class="control-group">
            <label class="control-label" for="inputConPass">Image 4: </label>
            <div class="controls">
                <asp:FileUpload ID="FileUpload4" runat="server" />
            </div>
        </div>
    </div>
    <div style="clear: both"></div>
    <div class="control-group">
        <div class="controls">
            <asp:Button ID="btnUpdate" CssClass="btn btn-primary" Text="Save Changes" runat="server" CommandName="Update" Visible='<%# !(DataItem is Telerik.Web.UI.GridInsertionObject) %>'></asp:Button>
            <asp:Button ID="btnInsert" Text="Add new" CssClass="btn btn-primary" runat="server" CommandName="PerformInsert"
                Visible='<%# DataItem is Telerik.Web.UI.GridInsertionObject %>'></asp:Button>
            &nbsp;
            <asp:Button ID="btnCancel" Text="Cancel" CssClass="btn" runat="server" CausesValidation="False"
                CommandName="Cancel"></asp:Button>
        </div>
    </div>
</div>
<script type="text/javascript">

    // Declare known file extensions in an array
    var validFilesTypes = ["bmp", "gif", "png", "jpg", "jpeg"];

    function ValidateFile() {
        var file = document.getElementById("<%=FileUploadKey.ClientID%>");
        var label = document.getElementById("<%=lblFileUploadMessage.ClientID%>");
        var path = file.value;
        var ext = path.substring(path.lastIndexOf(".") + 1, path.length).toLowerCase();
        var isValidFile = false;
        for (var i = 0; i < validFilesTypes.length; i++) {
            if (ext == validFilesTypes[i]) {
                isValidFile = true;
                break;
            }
        }
        if (!isValidFile) {
            label.style.color = "red";
            label.innerHTML = "Invalid File. Please upload a File with" +
            " extension:\n\n" + validFilesTypes.join(", ");
        }
        return isValidFile;
    }
</script>
